<template>
    <div class=''>
        <el-dialog title="余额记录" visible @close="$emit('close')" width="1000px" append-to-body :close-on-click-modal="false">
            <el-form ref="form" :model="form" label-width="120px" v-loading="loading">
                <el-row>
                    <el-col :span="8">
                        <el-form-item label="用户名:">
                            <span>{{ form.name }}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="昵称:">
                            <span>{{ form.nicename }}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="手机号:">
                            <span>{{ form.mobile}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="总金币:">
                            <span>{{ form.coin_total}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="剩余金币:">
                            <span>{{ form.coin_remain}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="8">
                        <el-form-item label="已使用金币:">
                            <span>{{ form.coin_used}}</span>
                        </el-form-item>
                    </el-col>
                    <el-col :span="24">
                        <el-table border v-loading="loading" :data="tableList" ref="tableList" v-tableHeight :height="tableList.length > 0 ? '500px' : '120px'">
                            <el-table-column label="余额变动类型" align="center">
                                <template slot-scope="scope">
                                    <span>{{selectDictLabel(changeTypeList, scope.row.change_type) }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="余额类型" align="center">
                                <template slot-scope="scope">
                                    <span>{{selectDictLabel(balanceTypeList, scope.row.balance_type) }}</span>
                                </template>
                            </el-table-column>
                            <el-table-column label="关联订单号" align="center" prop="tie_order_no" />
                            <el-table-column label="变动金额" align="center" prop="reality_account_amount" />
                            <el-table-column label="理论变动金额" align="center" prop="theory_account_amount" />
                            <el-table-column label="变动时间" align="center" prop="create_time" />
                        </el-table>
                    </el-col>
                </el-row>
            </el-form>
        </el-dialog>
    </div>
</template>

<script>
import { getBalanceToUser } from "@/api/senior/index.js"
import { changeTypeList, balanceTypeList } from "@/api/dictionary.js"
export default {
    name: '',
    components: {

    },
    props: {
        uid: {
            type: String,
            default: ""
        }
    },
    data() {
        return {
            loading: false,
            form: {},
            tableList: [],
            changeTypeList: changeTypeList,
            balanceTypeList: balanceTypeList
        }
    },
    created() {
        this.getList()
    },
    methods: {
        getList() {
            this.loading = true;
            getBalanceToUser({ uid: this.uid }).then(res => {
                console.log(res, "ressss")
                this.form = res.data
                this.tableList = res.data ? res.data.lists : [];
                // this.pageCount = res.data.pageCount;
                this.loading = false;
            });
        },
    },
}

</script>
<style scoped lang='scss'>
</style>